<template>
	<view :class="[primarySize()]">
		<view class="container p30">
			<view class="nothing" v-if="list.length===0">
				<image src="https://admin.mosizp.cn/static/public/icon_nothing.png" mode="aspectFill"></image>
				<text>抱歉，暂无相关信息</text>
			</view>
			<block v-if="list.length>0">
				<view class="business_item" v-for="(item,index) in list">
					<view class="recom_info">
						<view class="m-list-flex">
							<view class="business_img">
								<image :src="cdnurl(item.enterpriseinfo.logo)||'https://admin.mosizp.cn/static/public/business_logo.png'">
								</image>
							</view>
							<view class="m-cell-bd business_info">
								<view class="m-list-flex">
									<view class="fs32 col0 fd m-cell-bd">{{item.job.job_name}}</view>
									<view class="fs24 col9">{{formatDatetime(item.createtime,'mm月dd日')}}</view>
								</view>
								<view class="m-list-flex">
									<view class="m-cell-bd">
										<view class="pt10">{{item.job.city.shortname}} ｜
											{{item.enterpriseinfo.full_name||item.enterpriseinfo.company_name}}
										</view>
										<view class="fs24 col3 pt10"><text
												class="recom_price">{{item.job.salary_text}}</text></view>
									</view>
									<button @click="bindCreateComment(index)" hover-class="none"
										class="eval_btn">评价</button>
								</view>

							</view>
						</view>

					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	export default {
		data() {
			return {
				
				list: [],
			}
		},
		onReady() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.primaryColor()
			})
		},
		onLoad: function(options) {
			let page = this;
			this.$core.get({
				url: 'xilujob.interview_comment/not_comment_list',
				success: ret => {
					this.list=ret.data
				}
			});
		},
		methods: {
			bindCreateComment(i) {
				let index = i;
				let interview = this.list[index];
				uni.navigateTo({
					url: '/pages/user/appraise',
					events: {
						dataTransfer: data => {
							let interview = data.interview;
							for (let i = 0; i < this.list.length; i++) {
								if (this.list[i].id == interview.id) {
									this.list.splice(i, 1);
									this.list= this.list
									break;
								}
							}
							uni.$emit(app.globalData.Events.InterviewCommentAdd, {
								count: this.list.length
							});
						}
					},
					success: res => {
						res.eventChannel.emit('dataTransfer', {
							interview: interview
						});
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.business_item {
		box-shadow: 0px 1px 18px 0px rgba(0, 0, 0, 0.06);
		background-color: #fff;
		border-radius: 4rpx;
		margin-bottom: 18rpx;
		padding: 35rpx 30rpx 35rpx;
		position: relative;
		overflow: hidden;
	}

	.business_img {
		align-self: flex-start;
		margin-top: 20rpx;
	}

	.business_img image {
		width: 116rpx;
		height: 116rpx;
		margin: 0 30rpx 0 10rpx;
		display: block
	}

	/* .business_img image{width: 100%;height: 100%;display: block} */
	.business_info {
		font-size: 24rpx;
		color: #333
	}

	.cancel_star {
		font-size: 20rpx;
		color: #999;
		line-height: 39rpx;
		height: 39rpx;
		border-radius: 8rpx;
		border: 1rpx solid #E1E1E1;
		padding: 0 15rpx;
		margin-bottom: 13rpx;
		margin: 24rpx 26rpx 0 0;
		width: 107rpx;
		text-align: center
	}

	.star_type {
		float: left;
		font-size: 20rpx;
		color: #999;
		border-radius: 8rpx;
		line-height: 39rpx;
		height: 39rpx;
		padding: 0 17rpx;
		background-color: #F7F7F7;
		border: 1rpx solid #F7F7F7;
		margin-right: 13rpx;
		margin-bottom: 13rpx;
	}

	.clearfix {
		display: block;
	}

	.clearfix:after {
		content: "$";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
		overflow: hidden;
	}

	/* 组件 - flex */
	.m-list-flex {
		display: flex;
		align-items: center;
	}

	.m-list-flex .m-cell-bd {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
		overflow: hidden;
	}

	.fs24 {
		font-size: 24rpx;
	}

	.col3 {
		color: #333
	}

	.fs32 {
		font-size: 32rpx;
	}

	.pt10 {
		padding-top: 10rpx;
	}

	.pt20 {
		padding-top: 20rpx;
	}

	.pb10 {
		padding-bottom: 10rpx;
	}

	.top {
		position: absolute;
		top: 0;
		right: 0;
		width: 74rpx;
		height: 74rpx;
	}

	.pt24 {
		padding-top: 24rpx;
	}

	.recom_price {
		font-size: 28rpx;
		color: var(--primary);
		font-weight: bold;
		padding-top: 20rpx;
	}

	.eval_btn {
		background-color: #fff;
		border: 1px solid var(--primary);
		font-size: 24rpx;
		color: var(--primary);
		padding: 0 30rpx;
		line-height: 44rpx;
		border-radius: 8rpx;
	}
</style>